<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>对象的声明</title>
</head>
<body>
  <h2></h2>
  <script>
    /**
     * 描述一部电影 『夏洛特烦恼』
     */
    // let title = '夏洛特烦恼';
    // let director = '开心麻花';
    // let pubTime = 2015;
    //声明一个对象
    let movie = {
      //名称
      title: '夏洛特烦恼',
      //导演
      director: '开心麻花',
      //上映时间
      pubTime: 2015,
      //演员
      actors: '沈腾, 玛丽, 艾伦',
      //类型
      type: '喜剧'
    };

    //输出
    // console.log(movie);

    //对成员的访问  
    //方式一
    // console.log(movie.title);
    //方式二
    // console.log(movie['title']);

    // //获取 h2 元素
    let h2 = document.querySelector('h2');

    // //设置 h2 中间的文本
    // h2.innerHTML = movie.title;


    //声明一个对象 关于我
    let me = {
      //基本信息
      name: 'xiaohigh',
      age: 36,
      height: 180,
      weight: 160,
      experice: 12,
      //功能
      program: function(){
        console.log('我可以编程....');
      },
      teach: function(){
        console.log('我可以讲课....');
      },
      resolveProblem: function(){
        console.log('可以解决BUG...');
      }
    };

    //访问 me 对象中的 name 属性, 数据操作的三种方式
    // console.log(me.name);
    // alert(me.name);
    // h2.innerHTML = me.name;

    //调用 me 对象中的功能
    me.teach();

    /**
     * 声明一个对象, 关于手机的对象
     */
    let phone = {
      // 品牌
      brand: '1+',
      // 价格
      price: 1799,
      // 颜色
      color: "蓝色",
      //打电话
      call: function(){
        console.log('可以打电话....');
      },
      //发消息
      sendMessage: function(){
        console.log('发送消息....');
      },
      //玩游戏
      playGame: function(){
        console.log('可以玩游戏...');
      }
    }

    //获取属性
    console.log(phone.brand);
    //调用方法
    phone.call();
  </script>
</body>
</html>